﻿@using Digital.WCFClient.ConfigService
@using System.Collections.ObjectModel
@using Digital.Common.Mvc.Extensions
@using Microsoft.AspNet.Identity
@model Digital.WCFClient.ConfigService.CasesCategoryModel
@{
    ViewBag.Title = "案例分类管理";
    Layout = "~/Views/Shared/_LayoutDigital.cshtml";
}

@section PageSpecificJavascriptIncludes{
    <link rel="stylesheet" href="../DigitalStyle/css/jquery.gritter.css" />
    <link rel="stylesheet" href="../DigitalStyle/css/bootstrap-fileupload.min.css" />
    <script src="../DigitalStyle/js/jquery.gritter.min.js"></script>
    <script src="../DigitalStyle/js/bootstrap-fileupload.min.js"></script>
    <script src="../DigitalStyle/js/jquery.validate.js"></script>
    <script src="../DigitalStyle/js/JqueryToken.js"></script>
    <script src="../DigitalStyle/js/jquery.autogrow-textarea.js"></script>
    <script src="../DigitalStyle/js/messages_cn.js"></script>
    <script type="text/javascript" src="@Url.StaticFile("/DigitalStyle/js/flashupload.js")"></script>
    <script src="../DigitalStyle/js/formvalidator.js"></script>
}
<div class="pageheader">
    <h2><i class="fa fa-user"></i> 案例分类管理 <span>案例中心</span></h2>
    <div class="breadcrumb-wrapper">
        <span class="label">你的位置:</span>
        <ol class="breadcrumb">
            <li><a href="">企业中心</a></li>
            <li class="active">案例管理</li>
        </ol>
    </div>
</div>

<div class="contentpanel">
    <div class="row">

        <div class="col-sm-12">
            <div class="panel panel-info">
                <div class="panel-heading">
                    <div class="panel-btns">
                        <a href="" class="minimize">&minus;</a>
                    </div><!-- panel-btns -->
                    <h3 class="panel-title">分类管理</h3>
                </div>
                <div class="panel-body">
                    <div class="btn-demo mr10">
                        @*<button class="btn btn-primary mr5" data-toggle="modal" data-target=".bs-example-modal-lg">Large Modal</button>*@
                        <a class="btn btn-primary" onclick="javascript:Show(0)"><i class="fa fa-pencil mr5"></i> 添加顶级分类</a>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-hidaction table-hover mb30">
                            <thead>
                                <tr>
                                    <th>排序</th>
                                    <th>分类名称</th>
                                    <th>子类</th>
                                    <th>分类图片</th>
                                    <th>分类内容</th>
                                    <td>操作</td>
                                </tr>
                            </thead>
                            <tbody>
                                @{
                                    var List = (List<CasesCategoryModel>)ViewBag.CategoryList;
                                    if (ViewBag.CategoryList != null && (List.Count > 0))
                                    {
                                        var Parent = List.Where(o => o.CasesCategoryParentID == 0).ToList();
                                        foreach (var CategoryMode in Parent)
                                        {
                                            <tr id="tr@{@CategoryMode.CasesCategoryID}">
                                                <td>@CategoryMode.CasesCategoryOrderID</td>
                                                <td>@CategoryMode.CasesCategoryName</td>
                                                <td><a href="javascript:Show(@CategoryMode.CasesCategoryID)"><i class="fa fa-plus-square"></i></a> 添加子类</td>
                                                <td>@CategoryMode.CasesCategoryPicture</td>
                                                <td>@CategoryMode.CasesCategoryContent</td>
                                                <td><a class="btn btn-primary" onclick="javascript:Delete(@CategoryMode.CasesCategoryID)"><i class="fa fa-pencil mr5"></i> 删除</a>&nbsp;<a class="btn btn-primary" onclick="javascript:Edit(@CategoryMode.CasesCategoryID,0)"><i class="fa fa-pencil mr5"></i> 修改</a></td>
                                            </tr>
                                            var SubChild = List.Where(o => o.CasesCategoryParentID == CategoryMode.CasesCategoryID).ToList();
                                            foreach (var Childs in SubChild)
                                            {
                                                <tr id="tr@{@Childs.CasesCategoryID}">

                                                    <td>@Childs.CasesCategoryOrderID</td>
                                                    <td>@Childs.CasesCategoryName</td>
                                                    <td>@CategoryMode.CasesCategoryName 的子分类</td>
                                                    <td>@Childs.CasesCategoryPicture</td>
                                                    <td>@Childs.CasesCategoryContent</td>
                                                    <td><a class="btn btn-primary" onclick="javascript:Delete(@Childs.CasesCategoryID)"><i class="fa fa-pencil mr5"></i> 删除</a>&nbsp;<a class="btn btn-primary" onclick="javascript:Edit(@Childs.CasesCategoryID,@CategoryMode.CasesCategoryID)"><i class="fa fa-pencil mr5"></i> 修改</a></td>
                                                </tr>
                                            }
                                        }
                                    }

                                }
                            </tbody>
                        </table>

                    </div>

                    @*<div class="btn-demo mr10">
                            <button class="btn btn-primary mr5" type="button"><i class="fa fa-pencil mr5"></i> 添加顶级分类</button>
                            <button class="btn btn-primary mr5" type="button"><i class="fa fa-comments mr5"></i> 保存</button>
                        </div>*@

                </div>
            </div><!-- panel -->
        </div><!-- col-sm-6 -->

    </div>
</div>

<div class="alert alert-warning fade in nomargin">
    <button aria-hidden="true" data-dismiss="alert" class="close" type="button">&times;</button>
    <h4>温馨提示</h4>
    <p>
        1、如果您的信息较多，建议设置二级分类，方便用户查找；<br>
        2、建议尽量控制每个分类下的供应产品数量，用户查看更方便；<br>
        3、您设置成功的自定义分类，在您企业店铺显示会有一定时间的延迟。<br>
        4、超过10个自定义分类不允许一次性清空
    </p>

</div>

<div class="modal fade bs-example-modal-lg" id="DetailModel" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">&times;</button>
                <h4 class="modal-title">添加顶级分类</h4>
            </div>
            <form id="firstForm" class="form" onsubmit="return false;">
                <div class="modal-body">
                    <input type="hidden" id="ParentId" />
                    <input type="hidden" id="CaseId" />
                    @Html.AntiForgeryToken()
                    <div class="form-group">
                        <label class="col-sm-3 control-label"><span class="asterisk">*</span> 排序值</label>
                        <div class="col-sm-4">
                            @*<input type="text" id="OrderId" placeholder="排序值..." class="form-control" required/>*@
                            @Html.TextBoxFor(m => m.CasesCategoryOrderID, new { @id = "OrderId", @class = "form-control", @placeholder = "排序值..." })
                            @Html.ValidationMessageFor(m => m.CasesCategoryOrderID, null, new { @class="help-inline"})
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label"><span class="asterisk">*</span> 分类名称</label>
                        <div class="col-sm-6">
                            @*<input type="text" id="Name" placeholder="分类名称..." class="form-control" required />*@
                            @Html.TextBoxFor(m => m.CasesCategoryName, new { @id = "Name", @placeholder = "分类名称...", @class = "form-control" })
                            @Html.ValidationMessageFor(m => m.CasesCategoryName, null, new { @class="help-inline"})
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label"><span class="asterisk">*</span> 分类图片</label>
                        <div class="col-sm-6">
                            <div class="fileupload fileupload-new" data-provides="fileupload" id="container">
                                <div class="input-append">
                                    <div class="uneditable-input">
                                        <i class="glyphicon glyphicon-file fileupload-exists"></i>
                                        <span id="filelist" class="fileupload-preview"></span>
                                    </div>
                                    <span class="btn btn-default btn-file">
                                        <span class="fileupload-new">选择分类图片</span>
                                        <span class="fileupload-exists">更改</span>
                                        @*<input id="pickfiles" value="" type="file" required/>*@
                                        @Html.TextBoxFor(m => m.CasesCategoryPicture, new { @id = "pickfiles", @type = "file" })
                                        @Html.ValidationMessageFor(m => m.CasesCategoryPicture, null, new { @class="help-inline"})
                                    </span>
                                    <a href="#" id="uploadfiles" class="btn btn-default">上传</a>
                                </div>
                            </div>
                            <input id="ImagePath" type="hidden" value="" />

                            <img id="PersonImage" src="../DigitalStyle/images/pic-none.png" class="thumbnail img-responsive" alt="" />
                            @*<div id="uploader"></div>
                                <img id="Image" src="../DigitalStyle/images/pic-none.png" class="thumbnail img-responsive" alt="" />
                                <input type="hidden" id="ImagePath" />*@
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">分类内容</label>
                        <div class="col-sm-6">
                            @*<textarea id="Content" class="form-control" rows="5"></textarea>*@
                            @Html.TextAreaFor(m => m.CasesCategoryContent, new {@id="Content" ,@class="form-control" ,@rows="5" })
                            @Html.ValidationMessageFor(m => m.CasesCategoryContent, null, new { @class="help-inline"})
                            <span class="help-block">
                                (限制100字以内)
                            </span>
                        </div>
                    </div>

                    <div class="panel-footer">
                        <div class="row">
                            <div class="col-sm-6 col-sm-offset-3">
                                <button class="btn btn-primary" onclick="javascript:Save()">提交</button>&nbsp;
                                <button class="btn btn-default">取消</button>
                            </div>
                        </div>
                    </div>


                </div>
            </form>
        </div>
    </div>
</div>

<script>
    function callback(msg) {
        $("#ImagePath").val(msg.msg.url);
        $("#PersonImage")[0].src = msg.msg.url;
    }
    jQuery(document).ready(function () {

        // Delete row in a table
        jQuery('.delete-row').click(function () {
            var c = confirm("Continue delete?");
            if (c)
                jQuery(this).closest('tr').fadeOut(function () {
                    jQuery(this).remove();
                });

            return false;
        });
        $('#UploadButton').FileUpload({
            'subfolder': 'UserInfo' + '@Digital.Common.CryptoService.MD5Encrypt(User.Identity.GetUserId(),Digital.Common.SerurityType.UserInfoFolder)',
            'ImageId': '',
        });

        // Chosen Select
        //jQuery(".chosen-select").chosen({ 'width': '100%', 'white-space': 'nowrap' });

        // Textarea Autogrow
        //$("#autoResizeTA").autogrow();

        // With Form Validation Wizard
        var $validator = jQuery("#firstForm").validate({
            rules: {
                CasesCategoryOrderID: {
                    required: true,
                    isContainsSpecialChar: true,
                    numberCheck: true
                },
                CasesCategoryName: {
                    required: true,
                    isContainsSpecialChar: true
                },
                CasesCategoryPicture: {
                    required: true
                },
                CasesCategoryContent: {
                    required: true,
                    stringContentCheck: [1, 200]
                }
            },
            messages: {
                CasesCategoryOrderID: {
                    required: "请输入类别排序值",
                    isContainsSpecialChar: "含有中英文特殊字符",
                    numberCheck: "只能包括数字"
                },
                CasesCategoryName: {
                    required: "请输入类别名称",
                    isContainsSpecialChar: "含有中英文特殊字符"
                },
                CasesCategoryPicture: {
                    required: "请选择类别图片",
                },
                CasesCategoryContent: {
                    required: "请输入类别内容",
                    stringContentCheck: $.validator.format("请确保内容输入{0}-{1}字节以内")
                }
            },
            highlight: function (element) {
                jQuery(element).closest('.form-group').removeClass('has-success').addClass('has-error');
            },
            success: function (element) {
                jQuery(element).closest('.form-group').removeClass('has-error');
            },
            focusInvalid: false,
            onkeyup: false,
            ignore: '',
            errorPlacement: function (error, element) {
                error.insertAfter($(element).parent().children().last());
            }
        });


    });
    function callBack() {
        //$("#DetailModel").modal("hide");
        window.location = window.location;

    }

    function Show(ParentId) {
        $("#Name").val("");
        $("#OrderId").val("");
        $("#PersonImage")[0].src = '../DigitalStyle/images/pic-none.png';
        $("#ImagePath").val('../DigitalStyle/images/pic-none.png');
        $("#Content").val("");
        $("#DetailModel").modal("show");
        $("#CaseId").val(0);
        $("#ParentId").val(ParentId);
    }

    function Delete(Id) {
        ComAjax("/Company/CompanyCasesClassDelete", { CasesId: Id }, "分类删除", "callBack");
    }

    function Edit(Id, Parent) {
        var OrderId = $("#tr" + Id).children().eq(0).text();
        var Name = $("#tr" + Id).children().eq(1).text();
        var Image = $("#tr" + Id).children().eq(3).text();
        var Content = $("#tr" + Id).children().eq(4).text();
        $("#CaseId").val(Id);
        $("#Name").val(Name);
        $("#OrderId").val(OrderId);
        $("#PersonImage")[0].src = Image;
        $("#ImagePath").val(Image);
        $("#Content").val(Content);
        $("#ParentId").val(Parent);
        $("#DetailModel").modal("show");
    }

    function Save() {

        var $valid = jQuery('#firstForm').valid();
        //debugger;
        if (!$valid) {
            return false;
        }
        else {
            var Name = $("#Name").val();
            var OrderId = $("#OrderId").val();
            var Image = $("#ImagePath").val();
            var Content = $("#Content").val();
            var Parent = $("#ParentId").val();
            if (Parent == null || typeof (Parent) == "undefined" || Parent == "") {
                Parent = 0;
            }
            var Id = $("#CaseId").val();
            ComAjax("/Company/CompanyCasesClassAdd", { Id: Id, CName: Name, COrderId: OrderId, CImage: Image, CContent: Content, CParent: Parent }, "分类管理", "callBack");
        }
    }


</script>
